import React, { Component } from 'react';
import '../styles/MyTabbar.scss'

class MyTabbar extends Component {
  constructor(props) {
    super(props)
    this.state = {
      list: [
        { name: '店铺' }, { name: '分类' }, { name: '全部商品' },
        { name: '购物车' }, { name: '个人中心' },
      ],
      index1: 0
    }
  }
  handclick(index) {
    this.setState({ index1: index })
  }
  render() {
    return (
      <div className='tabbar' >
        {
          this.state.list.map((item, index) => {
            return (
              <div className={'item2 ' + (this.state.index1 === index ? 'active' : '')} key={index} onClick={() => { this.handclick(index) }}>
                {item.name}
              </div>

            )
          })
        }

      </div>
    );
  }
}

export default MyTabbar;